<template>
  <a-card :bordered="false">

    <div class="table-operator" style="text-align: right;">
      <a-button type="primary" class="btn_add" @click="$refs.batchRegisterForm.batchReg()" icon="plus">批量注册
      </a-button>
      <a-button type="primary" class="btn_add" @click="$refs.addForm.add()" icon="plus">新增</a-button>
    </div>

    <div id="modelManager">
      <s-table
        ref="table"
        size="default"
        :columns="columns"
        :data="loadData"
        :alert="true"
        :rowKey="(record) => record.id"
        id="table-wrapper"
      >
      <span slot="modelFile" slot-scope="text,record">
        <a @click="record.modelFile&&$refs.playForm.play(record)">{{ getListen(record) }}</a>
      </span>

        <span slot="faultLevel" slot-scope="text">
        {{ faultLevelFilter(text) }}
      </span>

        <span slot="registerStatus" :confirmLoading="confirmLoading" slot-scope="text, record">
        <a v-if="text===0" @click="$refs.registerForm.edit(record)">{{ getRegisterStatus(text) }}</a>
        <label v-else>{{ getRegisterStatus(text) }}</label>
      </span>

        <span slot="action" slot-scope="text, record">
        <a @click="$refs.editForm.edit(record)" class="btn_edit">编辑</a>
        <a-divider type="vertical"/>
        <a-popconfirm placement="topRight" title="确认删除？" @confirm="() => del(record)">
          <a class="btn_del">删除</a>
        </a-popconfirm>
      </span>
      </s-table>
    </div>

    <add-form ref="addForm" @ok="handleOk"/>
    <edit-form ref="editForm" @ok="handleOk"/>
    <play-form ref="playForm" @ok="handleOk"/>
    <register-form ref="registerForm" @ok="handleOk"/>
    <batch-register-form ref="batchRegisterForm" @ok="handleOk"/>
  </a-card>
</template>

<script>
import {STable} from '@/components'
import {page, del} from '@/api/modular/main/bizfaultmodel/bizFaultModelManage'
import addForm from './addForm'
import editForm from './editForm'
import playForm from './playForm'
import registerForm from './registerForm'
import batchRegisterForm from "./batchRegisterForm";
import {sysDictTypeDropDown} from '@/api/modular/system/dictManage'

export default {
  components: {
    STable,
    addForm,
    editForm,
    playForm,
    registerForm,
    batchRegisterForm
  },

  data() {
    return {
      advanced: false, // 高级搜索 展开/关闭
      queryParam: {}, // 查询参数
      columns: [ // 表头
        {
          title: '模型文件',
          dataIndex: 'modelFile',
          scopedSlots: {customRender: 'modelFile'}
        },
        {
          title: '故障级别',
          dataIndex: 'faultLevel',
          scopedSlots: {customRender: 'faultLevel'}
        },
        /* {
          title: '所属设备',
          dataIndex: 'groupId'
        }, */
        {
          title: '所属行业',
          dataIndex: 'industryType'
        },
        {
          title: '故障名称',
          dataIndex: 'faultName'
        },
        {
          title: '故障编号',
          dataIndex: 'accessToken'
        },
        {
          title: '注册状态',
          dataIndex: 'registerStatus',
          scopedSlots: {customRender: 'registerStatus'}
        },
        // {
        //   title: '创建时间',
        //   dataIndex: 'createTime'
        // },
        {
          title: '操作',
          dataIndex: 'action',
          width: '150px',
          scopedSlots: {customRender: 'action'}
        }
      ],
      // 加载数据方法 必须为 Promise 对象
      loadData: parameter => {
        return page(Object.assign(parameter, this.queryParam)).then((res) => {
          return res.data
        })
      },
      selectedRowKeys: [],
      selectedRows: [],
      defaultExpandedKeys: [],
      replaceFields: {
        key: 'id'
      },
      confirmLoading: false
    }
  },
  created() {
    this.getFaultLevelList()
  },
  methods: {
    del(record) {
      del(record).then((res) => {
        if (res.success) {
          this.$message.success('删除成功')
          this.$refs.table.refresh()
        } else {
          this.$message.error('删除失败：' + res.message)
        }
      }).catch((err) => {
        this.$message.error('删除错误：' + err.message)
      })
    },
    getListen(record) {
      if (record.registerStatus === 0) {
        return '无'
      } else if (record.registerStatus === 1) {
        return '试听'
      }
    },
    getFaultLevelList() {
      sysDictTypeDropDown({code: 'fault_level'}).then((res) => {
        if (res.success) {
          this.faultLevelList = res.data
        }
      })
    },
    faultLevelFilter(text) {
      const values = this.faultLevelList.filter(item => item.code === text)
      if (values.length > 0) {
        return values[0].value
      }
    },
    getRegisterStatus(text) {
      if (text === 0) {
        return '去注册'
      } else if (text === 1) {
        return '已注册'
      }
    },
    toggleAdvanced() {
      this.advanced = !this.advanced
    },
    handleOk() {
      this.$refs.table.refresh()
    },
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
    }
  }
}
</script>

<style lang="less">
.table-operator {
  margin-bottom: 18px;
}

#modelManager .ant-table {
  height: 57.5vh !important;
}

button {
  margin-right: 8px;
}
</style>
